$(function () {
  // 切换小图标
  $('.icons').on('click',function(){
    $('.icons-contain').toggle();
  });
  $('.icons-inner>.fa').on('click',function(){
    // 获取到点击的class
    let classname = $(this).attr('class');
    $('.icons>.fa').attr('class',classname);
    // 修改隐藏域的
    $('#classname').val(classname);
  });

  $('#subBtn').on('click',function(){
  // 验证非空
  // 用户名正则，4到16位（字母，数字，下划线，减号）
  let nameVal = $('#name').val().trim();
  let slugVal = $('#slug').val().trim();

   if(nameVal.length == 0){
     $('.modal-body .container-fluid').text('请输入名称');
     $('#modelId').modal();
   };
   if(slugVal.length == 0){
    $('.modal-body .container-fluid').text('请输入别名');
    $('#modelId').modal();
  };
 let data = $('#fromId').serialize();
// console.log(data);
$.post('/addNewCategories',data,(res)=>{
  // console.log(res);
  let html = template('tp',res.data);
  $('tbody').append(html);
});
  });
  // 删除
  let delId = 0;
  let delTr = null;
  $('.text-center .btn-danger').on('click',function(){
    delTr = $(this).parents('tr');
    delId = delTr.attr('data-id');
    $('.modal-body .container-fluid').text('确定删除吗？');
    $('#modelId').modal();
  });
  // 删除角色
    $('#delId').on('click',function(){
      $.get('/delCategoriesById',{id:delId},(res)=>{
        // console.log(res);
        if(res.code == 200){
          delTr.remove();
          $('#modelId').modal('hide');
        }
      });
    });
  // 实现编辑,展示旧数据
  $('.text-center .btn-info').on('click',function(){
    delTr = $(this).parents('tr');
    delId = delTr.attr('data-id');
    $.get('/getcategoiesById',{id:delId},(res)=>{
      // console.log(res);
      if(res.code == 200){
        let {classname,id,name,slug} = res.data;
        $('#name').val(name);
        $('#slug').val(slug);
        $('.icons>.fa').attr('class','fa '+classname);
        // 把图片的隐藏域处理
        $('#classname').val(classname);
        // 隐藏图标
        $('#subBtn').attr('hidden',true);
        $('#saveBtn').removeAttr('hidden');
        $('#cancelBtn').removeAttr('hidden');
        let form = $('#fromId');
        let first = form.children().eq(0);
        // 添加隐藏域
        if(first.attr('type') == 'hidden'){
          //  生成新的，直接修改
          first.val(id);
       }else{
        let html = $('<input name="id" type="hidden" value="'+id+'">');
        form.prepend(html);
       };
      };
    });
  });
  // 保存
  $('#saveBtn').on('click',function(){
    // 验证表单
    // 获取数据
   let data = $('#fromId').serialize();
   console.log(data);
   $.post('/editCategories',data,(res)=>{
        console.log(res);
   });
  });
  // 取消
  $('#cancelBtn').on('click',function(){
  //  把表单的输入框清空
  $('#name').val('');
  $('#slug').val('');
  // 恢复图标
  $('.icons>.fa').attr('class','fa fa-glass');
  $('#classname').attr('class','fa fa-glass');
  // 删除id 的隐藏域
  $('#fromId').children().eq(0).remove();
  });
  // 全选全不选
  $('thead input[type="checkbox"]').on('click',function(){
    let status = $(this).prop('checked');
    $('tbody input[type="checkbox"]').prop('checked',status);
    status ? delBtn.show() : delBtn.hide();
  });
  let delBtn = $('.page-action > .btn-danger');
// 点选
$('tbody').on('click','input[type="checkbox"]',function(){
//  选中的个数，和所有的个数
let all = $('tbody input[type="checkbox"]');

let checkedLength = $('tbody input[type="checkbox"]:checked');
// let delBtn = $('.page-action > .btn-danger');
let checkedAll = all.length === checkedLength.length;
$('thead input[type="checkbox"]').prop('checked',checkedAll);
checkedLength.length > 1 ? delBtn.show() : delBtn.hide();
});
// 批量删除
$('.page-action .btn-danger').on('click',function(){
  let ids = [];
  let trall = [];
  //  获取id，存在一个数组里面
  let checkedAll = $('tbody input[type="checkbox"]:checked');
  checkedAll.each((index,ele)=>{
     tr = $(ele).parents('tr');
    let id = $(ele).parents('tr').attr('data-id');
    ids.push(id);
    trall.push(tr);
  });
   $.get('/deletemultiple',{id:ids},(res)=>{
        if(res.code == 200){
          trall.forEach(function(e,i){
            e.remove();
            delBtn.hide();
          });
        }
   });
});
// 修改状态
$('tbody').on('click','.btn-warning',function(){
  let hideTr = $(this).parents('tr');
  let hideId = hideTr.attr('data-id');
    $.get('/hideNavigation',{id:hideId},(res)=>{
      // console.log(res);
      if(res.code == 200){
        let html = ` <a href="javascript:;" class="btn btn-success btn-sm">显示</a>&nbsp;&nbsp;&nbsp;&nbsp;<span
        class="text-warning">当前没有在网站导航中显示</span>`;
        hideTr.children().eq(4).html(html);
      };
    });
});
$('tbody').on('click','.btn-success',function(){
  console.log(22)
  let hideTr = $(this).parents('tr');
  let hideId = hideTr.attr('data-id');
    $.get('/showNavigation',{id:hideId},(res)=>{
      console.log(res);
      if(res.code == 200){
        let html = `  <a href="javascript:;" class="btn btn-warning btn-sm">隐藏</a>&nbsp;&nbsp;&nbsp;&nbsp;<span
        class="text-success">当前在网站导航中显示</span>`;
        hideTr.children().eq(4).html(html);
      };
    });
});

});